<template>
  <div id="app">
    <header class="app-header">
      <div class="app-header-main">
        <a href="" class="app-header-ite">Web</a>
        <a href="" class="app-header-ite">Touch</a>
        <a href="" class="app-header-ite">DingTalk</a>
        <a href="" class="app-header-ite-r">论坛</a>
        <a href="" class="app-header-ite-r">模板中心</a>
        <a href="" class="app-header-ite-r">插件库</a>
        <a href="" class="app-header-ite-r">案例</a>
        <a href="" class="app-header-ite-r">定制</a>
      </div>
    </header>
    <nav class="app-nav">
      <div class="app-nav-main">
        <!-- <a href="" class="app-nav-ite">React</a> -->
        <!-- <a href="#/home" class="app-nav-ite">Web组件</a> -->
        <!-- <a href="#/mapstate" class="app-nav-ite">JS插件</a> -->
        <!-- <a href="#/ui" class="app-nav-ite">CSS</a> -->
        <!-- <a href="#/" class="app-nav-ite">开始使用</a> -->
        <router-link to="/addui" class="app-nav-ite" exact>添加ui</router-link>
        <router-link to="/home" class="app-nav-ite" exact>Web组件</router-link>
        <router-link to="/mapstate" class="app-nav-ite" exact>JS插件</router-link>
        <router-link to="/ui" class="app-nav-ite" exact>CSS</router-link>
        <router-link to="/" class="app-nav-ite" exact>开始使用</router-link>
      </div>
    </nav>
    <div class="app-banner">
      <h1 class="app-banner-til">CSS</h1>
      <p class="app-banner-intr">浏览器默认样式统一，基础样式，网格，表格、表单、按钮及常用组件样式。</p>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>

export default {
  name: 'app'
}
</script>

<style lang="less">
@import './less/reset.css';
@import './less/common.css';
@import './App.css';
</style>
